<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>药品订单</title>
  <link rel="stylesheet" href="../../css/orderypdd(订单管理-药品订单).css">
  <link rel="stylesheet" href="../../lib/bootstrap-3.4.1-dist/css/bootstrap.min.css" />
  <script src="../../lib/JQuery/jquery-1.11.3.js"></script>
  <script src="../../lib/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
</head>

<body>
  <div class="container-fluid">
    <div class="row">
      <div class="col-lg-12">
        <div id="searchBox">
          <form class="form-inline">
            <div class="form-group">
              <input type="text" class="form-control" id="searchOrderNum" placeholder="请输入订单号" />
            </div>
            <div class="form-group">
              <input type="text" class="form-control" id="searchUserName" placeholder="请输入用户姓名" />
            </div>
            <div class="form-group">
              <input type="text" class="form-control" id="searchUserPhone" placeholder="请输入用户手机号" />
            </div>
            <div class="form-group">
              <select id="selectStatue" class="form-control">
                <option value="0">选择订单状态</option>
                <option value="待接诊">待接诊</option>
                <option value="接诊中">接诊中</option>
                <option value="已取消">已取消</option>
                <option value="已完成">已完成</option>
              </select>
            </div>
          </form>
          <button class="btn btn-default" id="searchBtn">
            <span class="glyphicon glyphicon-search"></span> 查询
          </button>
          <button class="btn btn-default" id="reset">
            <span class="glyphicon glyphicon-repeat"></span> 清空
          </button>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12">
        <table id="table" class="table table-hover">
          <thead>
            <tr>
              <td>
                <input type="checkbox" id="inlineCheckbox1" value="option1" />
                ID
              </td>
              <td>订单编号</td>
              <td>问诊用户</td>
              <td>就诊专家</td>
              <td>联系方式</td>
              <td>订单金额</td>
              <td>实付金额</td>
              <td>支付方式</td>
              <td>订单状态</td>
              <td>创建时间</td>
              <td>操作</td>
            </tr>
          </thead>

          <tbody id="tableBox">
            <!-- 数据渲染在这 -->
          </tbody>
        </table>
      </div>
    </div>

    <div class="row">
      <div class="col-lg-12">
        <div id="pageBox">
          <span>共<span id="totPage"></span><span>条</span></span>
          <select id="selectShowPageNum" class="form-control">
            <option value="0">10条/页</option>
            <option value="1">20条/页</option>
            <option value="2">50条/页</option>
          </select>
          <span id="prePage" class="glyphicon glyphicon-chevron-left"></span>
          <span id="pageDiv">
            <!-- 页码渲染在这里 -->
          </span>
          <span id="nextPage" class="glyphicon glyphicon-chevron-right"></span>
          <span>前往
            <input type="text" id="goPageNum" class="form-control" /><span>
              页</span></span>
          <span id="goPage">跳转</span>
        </div>
      </div>
    </div>
  </div>

  <!-- 订单详情模态框 -->
  <div class="modal fade" id="infoDiv" tabindex="-1">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title" id="exampleModalLabel">订单详情</h4>
        </div>
        <div class="modal-body">
          <form>
            <div class="form-group">
              | 订单信息
            </div>
            <div class="xiangqingDiv">
              <div class="form-group">
                <div id="xiangqingdanhao">订单单号：</div>
                <div id="xiangqingjine">订单金额：</div>
              </div>
              <div class="form-group">
                <div id="xiangqingstatue">订单状态：</div>
                <div id="xiangqingzhifu">支付方式：</div>
              </div>
              <div class="form-group">
                <div id="xiangqingxiadanshijian">下单时间：</div>
                <div id="xiangqingzhifushijian">支付时间：</div>
              </div>
            </div>

            <div class="form-group">
              <div>备注：我是一段关于订单的特别标注，我一般不会超过100个字那么长</div>
            </div>

            <div class="form-group">
              | 问诊信息
            </div>

            <div class="xiangqingDiv">
              <div class="form-group">
                <div>患者姓名：松鼠</div>
                <div>患者年龄：18</div>
              </div>
              <div class="form-group">
                <div>身份证：330330330302003020</div>
                <div>性别：男</div>
              </div>
              <div class="form-group">
                <div id="xiangqingcontact">联系方式：</div>
                <div>就诊情况：已就诊</div>
              </div>
            </div>
            <div class="form-group">
              | 咨询问题
            </div>
            <div class="form-group">
              <textarea class="form-control" rows="3">手经常会发疼，胸口也经常发闷，难受，基本每周就会出现好几次这种情况，感觉自己快死了</textarea>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>

  <script>
    // 模拟数据
    let arr = [
      {
        id: 1,
        orderNum: 'LO92836352810',
        buyer: "Mr.A",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "管理员",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 2,
        orderNum: 'LO92836352811',
        buyer: "Miss.A",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "主治医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 3,
        orderNum: 'LO92836352812',
        buyer: "Mr.B",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "管理员",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 4,
        orderNum: 'LO92836352813',
        buyer: "Miss.B",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "药师",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "市场部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 5,
        orderNum: 'LO92836352814',
        buyer: "Mr.C",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "管理员",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 6,
        orderNum: 'LO92836352815',
        buyer: "Miss.C",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "主治医生",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 7,
        orderNum: 'LO92836352816',
        buyer: "Mr.D",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "服务部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 8,
        orderNum: 'LO92836352817',
        buyer: "Miss.D",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "药师",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 9,
        orderNum: 'LO92836352818',
        buyer: "Mr.E",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "药师",
        contact: "18868803516",
        dingdanzhuangtai: '接诊中',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 10,
        orderNum: 'LO92836352819',
        buyer: "Miss.E",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 11,
        orderNum: 'LO92836352820',
        buyer: "Mr.F",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 12,
        orderNum: 'LO92836352821',
        buyer: "Miss.F",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "主治医生",
        contact: "18868803516",
        dingdanzhuangtai: '已取消',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 13,
        orderNum: 'LO92836352822',
        buyer: "Mr.G",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已取消',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 14,
        orderNum: 'LO92836352823',
        buyer: "Mr.H",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已取消',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 15,
        orderNum: 'LO92836352824',
        buyer: "Mr.I",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已取消',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 16,
        orderNum: 'LO92836352825',
        buyer: "Miss.I",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 17,
        orderNum: 'LO92836352826',
        buyer: "Mr.J",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 18,
        orderNum: 'LO92836352827',
        buyer: "Mr.K",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 19,
        orderNum: 'LO92836352828',
        buyer: "Mr.L",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 20,
        orderNum: 'LO92836352829',
        buyer: "Mr.M",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 21,
        orderNum: 'LO92836352830',
        buyer: "Mr.N",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 22,
        orderNum: 'LO92836352831',
        buyer: "Mr.O",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 23,
        orderNum: 'LO92836352832',
        buyer: "Mr.P",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 24,
        orderNum: 'LO92836352833',
        buyer: "Mr.Q",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 25,
        orderNum: 'LO92836352834',
        buyer: "Mr.R",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 26,
        orderNum: 'LO92836352835',
        buyer: "Mr.S",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 27,
        orderNum: 'LO92836352836',
        buyer: "Mr.T",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '微信',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 28,
        orderNum: 'LO92836352837',
        buyer: "Mr.U",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 29,
        orderNum: 'LO92836352838',
        buyer: "Mr.V",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 30,
        orderNum: 'LO92836352839',
        buyer: "Mr.W",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 31,
        orderNum: 'LO92836352840',
        buyer: "Mr.X",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "客服部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 32,
        orderNum: 'LO92836352841',
        buyer: "Mr.Y",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 33,
        orderNum: 'LO92836352842',
        buyer: "Mr.Z",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "总部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 34,
        orderNum: 'LO92836352843',
        buyer: "Miss.J",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 35,
        orderNum: 'LO92836352844',
        buyer: "Miss.K",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 36,
        orderNum: 'LO92836352845',
        buyer: "Miss.L",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 37,
        orderNum: 'LO92836352846',
        buyer: "Miss.M",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 38,
        orderNum: 'LO92836352847',
        buyer: "Miss.N",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        orderNum: 'LO92836352848',
        id: 39,
        buyer: "Miss.O",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 40,
        orderNum: 'LO92836352849',
        buyer: "Miss.P",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 41,
        orderNum: 'LO92836352850',
        buyer: "Miss.Q",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 42,
        orderNum: 'LO92836352851',
        buyer: "Miss.R",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '已完成',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 43,
        orderNum: 'LO92836352852',
        buyer: "Miss.S",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 44,
        orderNum: 'LO92836352853',
        buyer: "Miss.T",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 45,
        orderNum: 'LO92836352854',
        buyer: "Miss.U",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 46,
        orderNum: 'LO92836352855',
        buyer: "Miss.V",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 47,
        orderNum: 'LO92836352856',
        buyer: "Miss.W",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 48,
        orderNum: 'LO92836352857',
        buyer: "Miss.X",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: "待支付",
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 49,
        orderNum: 'LO92836352858',
        buyer: "Miss.Y",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
      {
        id: 50,
        orderNum: 'LO92836352859',
        buyer: "Miss.Z",
        expt:'大米专家',
        dingdanjine: '￥99.0',
        shifujine: "￥99.0",
        payway: '支付宝',
        zhiwei: "医生",
        contact: "18868803516",
        dingdanzhuangtai: '待接诊',
        dept: "研发部",
        creTime: "2022-10-10 12:00:00",
        switch: "1",
      },
    ];

    // 初始化
    let showArr = [];
    let presentPage = 1;
    let presentData = [];
    let maxPage;
    let showPageNum = 10;
    let delId;
    // 时间
    let time = new Date();
    let year = time.getFullYear();
    let month = time.getMonth() + 1;
    let date = time.getDate();
    let hour = time.getHours();
    let minute = time.getMinutes();
    let second = time.getSeconds();
    let presentTime =
      year +
      "-" +
      month +
      "-" +
      date +
      " " +
      +hour +
      ":" +
      minute +
      ":" +
      second;
    resetPage();

    // 渲染表格数据
    function show(data) {
      $("#tableBox").html("");
      for (let i = 0; i < data.length; i++) {
        $("#tableBox").append(`
        <tr>
            <td><input type="checkbox" id="inlineCheckbox1" value="option1"> ${data[i].id
          }</td>  
            <td>${data[i].orderNum}</td>  
            <td>${data[i].buyer}</td>  
            <td>${data[i].expt}</td>
            <td>${data[i].contact}</td>  
            <td>${data[i].dingdanjine}</td> 
            <td>${data[i].shifujine}</td> 
            <td>${data[i].payway}</td>
            <td>${data[i].dingdanzhuangtai}</td>
            <td>${data[i].creTime}</td>
            <td>
                    <a data-toggle="modal" data-target="#infoDiv"
                    data-whatever="@mdo" id = 'xiangqingbtn' onclick = 'xianshixiangqing(${JSON.stringify(
            data[i]
          )})'>订单详情</a>
            </td >  
        </tr > `);
      }
    }

    // 切割并为show提供数据
    function showData(data, pageNum) {
      let qishi = (pageNum - 1) * showPageNum;
      presentData = data.slice(qishi, qishi + showPageNum);
      show(presentData);
      $("#totPage").text(showArr.length);
      $("#pageDiv .btn-default")
        .eq(pageNum - 1)
        .addClass("active")
        .siblings()
        .removeClass("active");
      presentPage = pageNum;
    }

    // 渲染页码
    function showPage(data) {
      maxPage = Math.ceil(data.length / showPageNum);
      $("#pageDiv").html("");
      for (let i = 1; i <= maxPage; i++) {
        $("#pageDiv").append(`<span span class="btn btn-default" > ${i}</span >`);
      }

      // 重置按钮
      $("#reset").click(function () {
        resetPage();
      });
    }
    // 初始和重置页面功能,以及清空按钮
    function resetPage() {
      $("#searchOrderNum").val("");
      $("#searchUserName").val("");
      $("#searchUserPhone").val("");
      $("#selectStatue").find("#type option:selected").val();

      showArr = [...arr];
      showPage(showArr);
      showData(showArr, 1);
    }

    // 跳转
    $("#pageDiv").on("click", ".btn-default", function () {
      showData(showArr, parseInt($(this).text()));
    });

    // 上一页
    $("#prePage").click(function () {
      if (presentPage > 1) {
        let shangyiye = presentPage - 1;
        showData(showArr, shangyiye);
      }
    });

    // 下一页
    $("#nextPage").click(function () {
      if (presentPage < maxPage) {
        let xiayiye = presentPage + 1;
        showData(showArr, xiayiye);
      }
    });
    // ================================查询====================================
    $("#searchBtn").click(function () {
      let searchOrderNum = $("#searchOrderNum").val();
      let searchUserName = $("#searchUserName").val();
      let searchUserPhone = $("#searchUserPhone").val();
      let selectStatue = $("#selectStatue").val();
      // console.log(searchOrderNum,selectStatue)

      showArr = [...arr];

      if (searchOrderNum != "") {
        for (let i = 0; i < showArr.length; i++) {
          if (showArr[i].orderNum != searchOrderNum) {
            showArr.splice(i, 1);
            i--;
          }
        }
      }

      if (searchUserName != '') {
        for (let i = 0; i < showArr.length; i++) {
          if (showArr[i].buyer != searchUserName) {
            expt:'大米专家'
            showArr.splice(i, 1);
            i--;
          }
        }
      }

      if (searchUserPhone != '') {
        for (let i = 0; i < showArr.length; i++) {
          if (showArr[i].contact != searchUserPhone) {
            showArr.splice(i, 1);
            i--;
          }
        }
      }

      if (selectStatue != '0') {
        for (let i = 0; i < showArr.length; i++) {
          if (showArr[i].dingdanzhuangtai != selectStatue) {
            showArr.splice(i, 1);
            i--;
          }
        }
      }
      showPage(showArr);
      showData(showArr, 1);
    });


    // =============================改变显示的人数=============================
    $("#selectShowPageNum").click(function () {
      let selectshowPageNum = $("#selectShowPageNum").val();

      if (selectshowPageNum == 0) {
        showPageNum = 10;
      } else if (selectshowPageNum == 1) {
        showPageNum = 20;
      } else if (selectshowPageNum == 2) {
        showPageNum = 50;
      }

      showPage(showArr);
      showData(showArr, 1);
    });

    // ==================================跳转==================================
    $("#goPage").click(function () {
      var reg = /^\d{1,}$/;
      if (reg.test($("#goPageNum").val())) {
        if ($("#goPageNum").val() <= maxPage) {
          showPage(showArr);
          showData(showArr, $("#goPageNum").val());
        }
      }
    });

    // ==================================详情==================================
    function xianshixiangqing(data) {
      $('#xiangqingdanhao').append(""+data.orderNum+"");
      $('#xiangqingjine').append(""+data.dingdanjine+"");
      $('#xiangqingstatue').append(""+data.dingdanzhuangtai+"");
      $('#xiangqingzhifu').append(""+data.payway+"");
      $('#xiangqingxiadanshijian').append(""+presentTime+"");
      $('#xiangqingzhifushijian').append(""+presentTime+"");
      $('#xiangqingcontact').append(""+data.contact+"");
    }
  </script>
</body>

</html>